import React, { useMemo, useState } from 'react'

import BusinessInformation from './components/BusinessInformation'
import ShareholderInformation from '../ShareholderInformation'
import MainMembers from './components/MainMembers'
import _CoreTeam from './components/CoreTeam'
import ChangeLog from './components/ChangeLog'
import './BasicInfor.css'

export interface BasicInforProps {
  companyCode: string
}

const BasicInfor: React.FC<BasicInforProps> = (props: BasicInforProps) => {
  const { companyCode } = props

  const [equityInformation, setequityInformation]: any = useState(true)

  const [equityInformationcount, setequityInformationcount]: any = useState('')

  const [eainMemberscount, seteainMemberscount]: any = useState('')

  const [changeLogcount, setchangeLogcount]: any = useState('')

  const [eainMembers, setMainMembers]: any = useState(true)
  const [_coreTeam, setCoreTeam] = useState(true)

  // 基础信息组件
  const anchorList: any = useMemo(
    () => [
      {
        id: '基本信息',
        label: '基本信息',
        key: 'businessInformation',
        component: <BusinessInformation companyCode={companyCode} />,
        show: true
      },
      {
        label: '股东信息',
        id: '股东信息',
        key: 'equityInformation',
        count: equityInformationcount,
        component: <ShareholderInformation companyCode={companyCode} hiddenModule={(e: any) => hiddenModule(e, 'equityInformation')} />,
        show: equityInformation > 0 ? true : false
      },
      {
        label: '主要成员',
        id: '主要成员',
        count: eainMemberscount,
        key: 'mainMembers',
        component: <MainMembers companyCode={companyCode} hiddenModule={(e: any) => hiddenModule(e, 'eainMembers')} />,
        show: eainMembers > 0 ? true : false
      },
      // {
      //   label: '人才团队',
      //   id: '人才团队',
      //   key: 'coreTeam',
      //   component: <CoreTeam companyCode={companyCode} hiddenModule={(e: any) => hiddenModule(e, 'coreTeam')} />,
      //   show: coreTeam
      // },
      {
        label: '变更信息',
        id: '变更信息',
        key: 'changeLog',
        count: changeLogcount,
        component: <ChangeLog companyCode={companyCode} hiddenModule={(e: any) => hiddenModule(e, 'changeLog')} />,
        show: true
      }
    ],
    [companyCode, equityInformation, eainMembers, changeLogcount]
  )

  function hiddenModule(value: any, props: any) {
    if (props === 'equityInformation') {
      setequityInformation(value)
      setequityInformationcount(value)
    }
    if (props === 'eainMembers') {
      setMainMembers(value)
      seteainMemberscount(value)
    }
    if (props === 'coreTeam') setCoreTeam(value)
    if (props === 'changeLog') {
      let count = 0
      value?.map((item: any) => (count += item.value))
      setchangeLogcount(count)
    }
  }

  return (
    <div className="company-overview-wrapper" id="工商信息">
      <div className="company-overview-content">
        {anchorList.map((item: any, _index: any) =>
          item.show ? (
            <div id={item.id} className="com-box" key={_index} data-count={item.count}>
              <p className="com-title">{item.label}</p>
              <div>{item.component}</div>
            </div>
          ) : null
        )}
      </div>
    </div>
  )
}

export default BasicInfor
